import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:readmore/readmore.dart';
import 'package:travel/routes/index.dart';
import 'package:travel/utils/colors.dart';
import 'package:travel/utils/radian.dart';
import 'package:travel/utils/styles.dart';
import 'package:travel/utils/tools.dart';
import 'package:travel/screen/flutter_screenutil.dart';

class VideoInfoController extends GetxController with WidgetsBindingObserver {
  RxDouble top = RxDouble(0);

  RxBool isVideo = RxBool(true);

  RxBool isFollow = RxBool(false);

  RxBool isCollect = RxBool(false);

  RxBool isLike = RxBool(false);

  FocusNode focusNode = FocusNode();

  RxDouble bottom = RxDouble(0);

  late TextEditingController editingController;

  late PageController pageController;

  late TextEditingController textController;

  @override
  void onInit() {
    editingController = ToolsUtils.editingController('');
    textController = ToolsUtils.editingController('');
    top.value = Get.mediaQuery.padding.top;
    WidgetsBinding.instance.addObserver(this);
    pageController = PageController();
    pageController.addListener(() {
      Get.log('index = ${pageController.page}');
    });
    super.onInit();
  }

  @override
  void didChangeMetrics() {
    WidgetsBinding.instance.addPostFrameCallback((_) {
      bottom.value = MediaQueryData.fromView(WidgetsBinding.instance.platformDispatcher.views.first)
          .viewInsets
          .bottom;
    });
    super.didChangeMetrics();
  }

  @override
  void onClose() {
    WidgetsBinding.instance.removeObserver(this);
    focusNode.dispose();
    editingController.dispose();
    textController.dispose();
    pageController.dispose();
    super.dispose();
  }
}

class VideoInfoView extends GetView<VideoInfoController> {
  const VideoInfoView({super.key});

  @override
  Widget build(BuildContext context) {
    return Obx(() => onGestureDetector(context));
  }

  Widget onGestureDetector(BuildContext context) {
    return GestureDetector(
      onTap: () {
        controller.focusNode.unfocus();
      },
      child: Scaffold(
        body: Stack(
          fit: StackFit.expand,
          children: [
            PageView(
              scrollDirection: Axis.vertical,
              controller: controller.pageController,
              children: [
                Container(
                  decoration: const BoxDecoration(
                      image: DecorationImage(
                          fit: BoxFit.fill,
                          image: NetworkImage(
                              'https://cdn7.axureshop.com/demo2023/2251242/images/视频详情/u2170.png'))),
                ),
                Container(
                  decoration: const BoxDecoration(
                      image: DecorationImage(
                          fit: BoxFit.fill,
                          image: NetworkImage(
                              'https://cdn7.axureshop.com/demo2023/2251242/images/视频详情/u2170.png'))),
                )
              ],
            ),
            Positioned(
                top: controller.top.value,
                left: 0,
                right: 0,
                child: Container(
                  height: 44.h,
                  alignment: Alignment.centerLeft,
                  padding: EdgeInsets.symmetric(horizontal: 15.w),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Container(
                        width: 20.w,
                        alignment: Alignment.center,
                        child: InkWell(
                          onTap: Get.back,
                          child: Icon(
                            Icons.arrow_back_ios_new,
                            color: Colors.white,
                            size: 18.sp,
                          ),
                        ),
                      ),
                      Wrap(
                        crossAxisAlignment: WrapCrossAlignment.end,
                        children: [
                          IconButton(
                              alignment: Alignment.center,
                              padding: EdgeInsets.zero,
                              onPressed: () {
                                Get.toNamed(RoutePath.search);
                              },
                              icon:
                                  ToolsUtils.assetImageSvg('u253.svg', width: 18.w, height: 18.w)),
                          IconButton(
                              alignment: Alignment.center,
                              padding: EdgeInsets.zero,
                              onPressed: () {
                                controller.isVideo.value = !controller.isVideo.value;
                              },
                              icon: ToolsUtils.assetImageSvg(
                                  controller.isVideo.isTrue ? 'u251.svg' : 'u252.svg',
                                  width: 18.w,
                                  height: 18.w))
                        ],
                      )
                    ],
                  ),
                )),
            Positioned(
                left: 10.w,
                bottom: 10.h,
                child: SizedBox(
                  width: 256.w,
                  child: Column(
                    children: [
                      Container(
                        alignment: Alignment.centerLeft,
                        child: Wrap(
                          spacing: 10.w,
                          children: [
                            Container(
                              alignment: Alignment.center,
                              constraints: BoxConstraints.expand(width: 60.w, height: 30.h),
                              decoration: BoxDecoration(
                                  color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                  borderRadius: BorderRadius.circular(15.h)),
                              child: Text.rich(
                                TextSpan(children: [
                                  WidgetSpan(
                                      child: ToolsUtils.assetImageSvg('u276.svg',
                                          width: 12.w, height: 15.h)),
                                  TextSpan(
                                      text: ' 衡阳',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color841c, fontSize: 13.sp))
                                ]),
                                maxLines: 1,
                                overflow: TextOverflow.ellipsis,
                              ),
                            ),
                            Container(
                              alignment: Alignment.center,
                              padding: EdgeInsets.symmetric(horizontal: 10.w),
                              constraints: BoxConstraints.expand(width: 155.w, height: 30.h),
                              decoration: BoxDecoration(
                                  color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                  borderRadius: BorderRadius.circular(15.h)),
                              child: Text.rich(
                                TextSpan(children: [
                                  WidgetSpan(
                                      child: ToolsUtils.assetImageSvg('u279.svg',
                                          width: 15.w, height: 13.h)),
                                  TextSpan(
                                      text: ' 南岳衡山风景名胜尽在眼底中开始美好生活',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color841c, fontSize: 13.sp))
                                ]),
                                maxLines: 1,
                                overflow: TextOverflow.ellipsis,
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.symmetric(vertical: 15.h),
                        alignment: Alignment.centerLeft,
                        decoration: BoxDecoration(color: ColorsUtils.rgba(255, 255, 255, 0)),
                        child: Text(
                          '@小妞爱游荡',
                          style: StylesUtils.customTextStyle(shadows: [
                            Shadow(
                                color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412),
                                offset: const Offset(1, 1),
                                blurRadius: 5.0)
                          ]),
                        ),
                      ),
                      Container(
                        alignment: Alignment.centerLeft,
                        child: ReadMoreText(
                          '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛',
                          trimLines: 2,
                          trimMode: TrimMode.Line,
                          trimExpandedText: '展开',
                          trimCollapsedText: '收起',
                          moreStyle: StylesUtils.customTextStyle(
                            color: ColorsUtils.color3478,
                            fontSize: 14.sp,
                          ),
                          lessStyle: StylesUtils.customTextStyle(
                            color: ColorsUtils.color3478,
                            fontSize: 14.sp,
                          ),
                          style: StylesUtils.customTextStyle(),
                        ),
                      ),
                    ],
                  ),
                )),
            Positioned(
                right: 10.w,
                bottom: 10.h,
                child: SizedBox(
                  width: 50.w,
                  child: Column(
                    children: [
                      SizedBox(
                        height: 50.w,
                        child: Stack(
                          clipBehavior: Clip.none,
                          children: [
                            InkWell(
                              onTap: () {
                                Get.toNamed(RoutePath.homepageOther);
                              },
                              child: CircleAvatar(
                                radius: 25.w,
                                backgroundImage: const NetworkImage(
                                    'https://img0.baidu.com/it/u=2901830406,3460421538&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'),
                              ),
                            ),
                            Transform.translate(
                              offset: Offset(0, 25.h),
                              child: Center(
                                child: Container(
                                  constraints: BoxConstraints.expand(width: 45.w, height: 20.h),
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      gradient: LinearGradient(
                                          colors: [
                                            ColorsUtils.rgba(52, 120, 246, 1),
                                            ColorsUtils.rgba(2, 167, 240, 1)
                                          ],
                                          stops: const [
                                            0,
                                            0.9
                                          ],
                                          transform:
                                              GradientRotation(RadianUtils.angleToRadian(90))),
                                      borderRadius: BorderRadius.circular(10.h)),
                                  child: InkWell(
                                    onTap: () {
                                      controller.isVideo.value = !controller.isVideo.value;
                                    },
                                    child: Text(
                                      controller.isVideo.isTrue ? '已关注' : '关注',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: 11.sp, color: ColorsUtils.colorFfff),
                                    ),
                                  ),
                                ),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 15.h),
                        child: Column(
                          children: [
                            InkWell(
                              onTap: () {
                                controller.isCollect.value = !controller.isCollect.value;
                              },
                              child: Center(
                                  child: ToolsUtils.assetImageSvg(
                                      controller.isCollect.isTrue
                                          ? 'u267_selected.svg'
                                          : 'u267.svg',
                                      width: 46.w,
                                      height: 45.h)),
                            ),
                            Center(
                              child: Text(
                                '1.9万',
                                style: StylesUtils.customTextStyle(fontSize: 12.sp),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 15.h),
                        child: Column(
                          children: [
                            InkWell(
                                onTap: () {
                                  controller.isLike.value = !controller.isLike.value;
                                },
                                child: Center(
                                    child: ToolsUtils.assetImageSvg(
                                        controller.isLike.isTrue ? 'u266_selected' : 'u266.svg',
                                        width: 46.w,
                                        height: 44.h))),
                            Center(
                              child: Text(
                                '3.1万',
                                style: StylesUtils.customTextStyle(fontSize: 12.sp),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 15.h),
                        child: Column(
                          children: [
                            InkWell(
                                onTap: () {
                                  ToolsUtils.openAllComment(context,
                                      controller: controller.textController,
                                      onSubmitted: (String text) {});
                                },
                                child: Center(
                                    child: ToolsUtils.assetImageSvg('u268.svg',
                                        width: 46.w, height: 44.h))),
                            Center(
                              child: Text(
                                '1490',
                                style: StylesUtils.customTextStyle(fontSize: 12.sp),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 15.h),
                        child: Column(
                          children: [
                            InkWell(
                              onTap: () {
                                ToolsUtils.openShare(context);
                              },
                              child: Center(
                                  child: ToolsUtils.assetImageSvg('u269.svg',
                                      width: 46.w, height: 44.h)),
                            ),
                            Center(
                              child: Text(
                                '357',
                                style: StylesUtils.customTextStyle(fontSize: 12.sp),
                              ),
                            )
                          ],
                        ),
                      )
                    ],
                  ),
                )),
          ],
        ),
        bottomNavigationBar: SafeArea(
            bottom: true,
            child: Padding(
              padding: EdgeInsets.only(bottom: controller.bottom.value),
              child: Container(
                height: 50.h,
                alignment: Alignment.center,
                decoration: BoxDecoration(color: ColorsUtils.rgba(17, 17, 17, 1)),
                child: FractionallySizedBox(
                  heightFactor: 0.7.h,
                  widthFactor: 0.9,
                  child: TextField(
                    focusNode: controller.focusNode,
                    controller: controller.editingController,
                    cursorWidth: 2.0,
                    cursorRadius: const Radius.circular(2),
                    cursorColor: ColorsUtils.parseColorFromHexString(ColorsUtils.color3333),
                    style:
                        StylesUtils.customTextStyle(fontSize: 15.sp, color: ColorsUtils.color3333),
                    decoration: InputDecoration(
                      prefixIcon: Center(
                        child: ToolsUtils.assetImageSvg('u2209.svg', width: 15.w, height: 15.h),
                      ),
                      prefixIconConstraints: BoxConstraints.expand(width: 35.w, height: 15.h),
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(17),
                        borderSide: BorderSide.none,
                      ),
                      focusedBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(17),
                        borderSide: BorderSide.none,
                      ),
                      hintText: '我来说两句…',
                      contentPadding: EdgeInsets.symmetric(vertical: 10.h, horizontal: 10.w),
                      isCollapsed: true,
                      isDense: true,
                      fillColor: ColorsUtils.rgba(34, 34, 34, 1),
                      filled: true,
                      hintStyle: StylesUtils.customTextStyle(
                          color: ColorsUtils.color9999, fontSize: 15.sp),
                    ),
                    onSubmitted: (String content) {},
                  ),
                ),
              ),
            )),
      ),
    );
  }
}
